<template>
<div class="main">
    <div>{{all_myrest_LuckyRecord==null?'':''}}</div>
    <div class="wrap noContShowImage">
        <div class="item" v-for="item in all_myrest_LuckyRecord">
            <div class="recordinfo">
                <div class="propic"><img v-bind:src="item.productImg"></div>
                <div class="procnt">
                    <div class="proname">{{item.productName}}</div>
                    <div class="qihao">{{item.productPeriod}}</div>
                    <div class="wocanyu">
                        我已参与:<span class="cannum">{{item.buyNumberCount}}</span>人次<span class="xiangq">
                        <router-link :to="{path:'/Details'+ '/' + item.spellbuyProductId + '/' + item.productId}">查看详情</router-link>
                        <!--<a v-bind:href="'/#/Details?spellbuyProductId='+item.spellbuyProductId+'&productId='+item.productId">查看详情</a>-->
                        <a class="shaidan" v-bind:href="item.shareLink" >{{item.shareText}}</a>
                        </span>
                    </div>
                </div>
            </div>
            <div class="uinfo">
                <!--<div class="uname" v-if="item.buyStatus==0">期号:<span class="priceName">{{item.productPeriod}}</span></div>-->
                <div class="uname">中奖者:<span class="priceName">{{item.userName}}</span></div>
                <!--<div class="unum" v-if="item.buyStatus==0">剩余<span class="priceUserNum">37</span>人次</div>-->
            </div>
            <div class="yinzhang active"><img src="../assets/duoImages/yinzhang.png"></div>
        </div>
    </div>

</div>
</template>
<script>
  import stores from './mystore.js'
  import Vue from 'vue';
  import { XButton, XInput,Group, Tab, TabItem } from 'vux'
  import { mapGetters,mapActions } from 'vuex'
  import sha1 from 'js-sha1'

  export default {
      data(){
          return {
              mypayload:{
                  url:'duodata',
                  actionName:"LuckyRecord",
                  postData: {
                      //status:"0",
                      //mobile:"18616717008",
                      //password:"112233",
                      //treeView:"true"
                  }
              },

          }
      },

      computed:{
          all_myrest_LuckyRecord(){
              var dataval=this.$store.getters.all_restful_LuckyRecord;
              if(dataval){
                  var imgUploadShareLink='/#/Imgupload?spellbuyProductId='+duoid+'10446&userIdBuyCount='+56
                  for(var i=0;i<dataval.body.luckRecordlist.length;i++){
                    if(dataval.body.luckRecordlist[i].shareStatus==2){
                      dataval.body.luckRecordlist[i].shareText='查看晒单';
                      var shareInfoId=dataval.body.luckRecordlist[i].shareInfoId;
                      dataval.body.luckRecordlist[i].shareLink='/#/ImgShareDetails?shareInfoId='+shareInfoId;
                    }else if(dataval.body.luckRecordlist[i].shareStatus==-1 || dataval.body.luckRecordlist[i].shareStatus==1){
                      dataval.body.luckRecordlist[i].shareText='我要晒单';
                      var duoid=dataval.body.luckRecordlist[i].spellbuyProductId;
                      var userIdBuyCount=dataval.body.luckRecordlist[i].buyNumberCount;
                      dataval.body.luckRecordlist[i].shareLink='/#/Imgupload?spellbuyProductId='+duoid+'&userIdBuyCount='+userIdBuyCount;
                    }else if(dataval.body.luckRecordlist[i].shareStatus==0){
                      dataval.body.luckRecordlist[i].shareText='晒单正在审核';
                      dataval.body.luckRecordlist[i].shareLink='javascript:void(0)';
                    }
                  }
                  return dataval.body.luckRecordlist
              }else{
                  return null
              }
              //return dataval;
          },
          all_nots(){
              return this.$store.getters.all_nots
          },
          all_login(){
              return this.$store.getters.all_login
          },
          ...mapGetters([ 'evenOrOdd'
          ])
      },
      created (){
          this.cntReady();
          //console.log('hahahahhahahahah'+this.cntReady())
      },

      methods:{
          cntReady(){
              this.$store.commit('restful_api',this.mypayload);
           },

          ...mapActions([
              'increment',
              'decrement',
              'incrementIfOdd'
          ]),
      },
      components: { XButton, Group, XInput, Tab, TabItem }

  }

</script>
../assets/duoImages/
<style scoped>
  *{ margin:0; padding:0;}
  html,body{ width:100%; font-size:12px !important; color:#878787;  _cursor:pointer;}
  div img{ width:100%;}
  .clear:after{ content: ""; display: block;height: 0;visibility: hidden;clear: both;}
  .main{ position:relative;}

  /*=== 排序列表 ===*/
  .list_sort{ display:box; display:-webkit-box; width:100%; background-color:#fff; border-bottom:1px solid #eee;}
  .sortbox{ -webkit-box-flex:1; box-flex:1;}
  .opt{ width:60px; margin:0 auto; text-align:center; font-size:12px; color:#666; padding:10px 0 10px 0;}
  .opt.active{ border-bottom:3px solid #db3652; color:#db3652;}

  .item{ padding-left:15px; border-bottom:1px solid #c8c7cc; position:relative;}
  .recordinfo{ display:box; display:-webkit-box; border-bottom:1px solid #edeae7; padding:8px 0; }
  .propic{ width:80px;}
  .propic img{ width:100%;}
  .procnt{ box-flex:1;-webkit-box-flex:1; padding:5px 0 0 10px;}
  .proname{ color:#262626; font-size:14px; width:78%; height:38px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
  .qihao{ margin-top:6px; font-size: 12px;}
  .cannum{ color:#db3652;}
  .xiangq{ color:#007aff; margin-left:10px;}
  .xiangq a{ color:#007aff; text-decoration:none;}
  .uinfo{ display:box; display:-webkit-box; padding:10px 12px 10px 0;}
  .priceName{ color:#007aff;}
  .uname{ box-flex:1;-webkit-box-flex:1; padding-top:3px; font-size: 12px; color: #878787;}
  .unum{ box-flex:1;-webkit-box-flex:1; text-align:right; padding-top:3px; padding-right:10px; font-size: 12px; color: #878787;}
  .priceUserNum{ color:#db3652;}
  .ubtnbox{ width:60px;}
  .ubtn{ width:50px; border:1px solid #db3753; font-size: 12px; border-radius:3px; color:#db3753; padding:3px; cursor:pointer; }

  .yinzhang{ width:60px; position:absolute; right:6%; top:10px; -webkit-transform:rotate(15deg);transform:rotate(-15deg); display:none;}
  .yinzhang.active{ width:45px; position:absolute; right:5%; top:16px; -webkit-transform:rotate(-45deg);transform:rotate(-45deg); display:block;}
  .yinzhang img{ width:100%;}
  .shaidan{ float:right; margin-right:15px;}

  .wocanyu{ font-size: 12px; color: #878787;}

  /***=====   以下为原夺宝公共部分   =====****/
  /***数据为空***/
  .noContPic{ width:40%; margin:0 auto;}
  .noContTxt{ text-align:center; color:#bbb; margin-top:15px;}

  /**页面未找到**/
  .noPageWrap{ width:80%; margin:0 auto; padding-top:15%; }
  .noPageGoBack{ text-align:center; padding:15px; border-bottom:1px solid #eee; border-top:1px solid #eee; background-color:#fcfcfc;}

  /**购买 输入框**/
  .blackcover{ width:100%; height: 100%; background-color:#000; opacity:0.5; position:fixed; left:0; bottom:0; display:none; z-index:999;}
  .blackcover.blackcoverEleShow{ width:100%; height: 100%; background-color:#000; opacity:0.5; position:fixed; left:0; bottom:0; display:block; z-index:999;}
  .orderform{ width:100%; position:fixed; left:0; bottom:-300px; background-color:#fff; z-index:1000; _opacity:0.3;}
  .tishi{ display:box; display:-webkit-box; border-bottom:1px solid #e7e7e7; padding:15px; color:#999999; font-size:14px;}
  .tishi_cnt{  box-flex:1; -webkit-box-flex:1;}
  .shut{ width:15px; }
  .iptwrap{ padding-left:15px; border-bottom:1px solid #e7e7e7;}
  .iptarea{ border-bottom:1px solid #e7e7e7; padding-bottom:15px; position:relative;}
  .renci{ text-align:center; font-size:14px; padding:10px 0;}
  .numbox{ display:box; display:-webkit-box; width:70%; border:1px solid #aeaeae; border-radius:3px; margin:0px auto 15px auto; padding-top:1px;}
  .yu_tips{ position:absolute; right:15%; top:13px; color:#db3652; font-size:12px; opacity:0.8; display:none;}
  .jia,.jian{ width:15px; height:15px; padding:10px;}
  .jia{ border-left:1px solid #eee;}
  .jian{ border-right:1px solid #eee;}
  .iptvalbox{ box-flex:1; -webkit-box-flex:1;}
  .iptvalbox input{ width:100%; height:34px; font-size:14px; color:#db3652; border:none; text-align:center; outline:none; }
  .optlistbox{ width:70%; margin:0 auto;;}
  .optlist{ float:left; width:22%; margin-right:4%;}
  .optlistbtn{ border:1px solid #aeaeae; border-radius:3px; text-align:center; padding:3px 0;}
  .optlist:nth-last-child(1){ margin-right:0;}
  .ipt_buy{ padding:10px; color:#fff; font-size:14px;}
  .ipt_buy_btn{ width:100%; background-color:#db3652; border-radius:3px; text-align:center; padding:10px 0;}
  .unableClick{ width:100%; background-color:#db3652; border-radius:3px; text-align:center; padding:10px 0;}
  .totalprc{ text-align:center; padding:10px 0; color:#999;}
  .totalprcval{ color:#db3652;}

  /**==  动画  ==*/
  /*-----购买表单显示----------------------------*/
  .orderformEleShow{animation:orderformShow 0.5s forwards; -webkit-animation:orderformShow 0.5s forwards;}
  @keyframes orderformShow
  {
    from {bottom:-300px;}
    to {bottom:0px;}
  }
  @-webkit-keyframes orderformShow /*Safari and Chrome*/
  {
    from {bottom:-300px;}
    to {bottom:0px;}
  }
  /*-----购买表单隐藏----------------------------*/
  .orderformEleHide{animation:orderformHide 0.5s forwards; -webkit-animation:orderformHide 0.5s forwards;}
  @keyframes orderformHide
  {
    from {bottom:0px;}
    to {bottom:-300px;}
  }
  @-webkit-keyframes orderformHide /*Safari and Chrome*/
  {
    from {bottom:0px;}
    to {bottom:-300px;}
  }

  /*-----模态层显示----------------------------*/
  .blackcoverEleShow{animation:blackcoverShow 0.5s forwards; -webkit-animation:blackcoverShow 0.5s forwards;}
  @keyframes blackcoverShow
  {
    from {opacity:0;}
    to {opacity:0.5;}
  }
  @-webkit-keyframes blackcoverShow /*Safari and Chrome*/
  {
    from {opacity:0;}
    to {opacity:0.5;}
  }
  /*-----模态层隐藏----------------------------*/
  .blackcoverEleHide{animation:blackcoverHide 0.5s forwards; -webkit-animation:blackcoverHide 0.5s forwards;}
  @keyframes blackcoverHide
  {
    from {opacity:0;}
    to {opacity:0.5;}
  }
  @-webkit-keyframes blackcoverHide /*Safari and Chrome*/
  {
    from {opacity:0;}
    to {opacity:0.5;}
  }

</style>
